<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>multiselector</title>
<link rel="stylesheet" href="../../goog/css/common.css">
<link rel="stylesheet" href="../../goog/css/menubutton.css">
<link rel="stylesheet" href="../../goog/css/menu.css">
<link rel="stylesheet" href="../../goog/css/menuitem.css">
<link rel="stylesheet" href="../../goog/css/menuseparator.css">
<link rel="stylesheet" href="../../goog/css/flatmenubutton.css">
<link rel="stylesheet" href="../../goog/css/checkbox.css">
<link rel="stylesheet" href="../../goog/css/button.css">
<link rel="stylesheet" href="../../goog/css/custombutton.css">
<link rel="stylesheet" type="text/css" href="../../goog/css/css3button.css">
<script src="../../goog/base.js"></script>
<script>
goog.require('goog.events.EventTarget');
goog.require('goog.ui.Component');
</script>
<script src="../../fiesc/ui/component.js"></script>
<script src="../../fiesc/ui/listitemrenderer.js"></script>
<script src="../../fiesc/ui/listitem.js"></script>
<script src="../../fiesc/ui/listrenderer.js"></script>
<script src="../../fiesc/ui/list.js"></script>
<script src="../../fiesc/ui/multiselectorrenderer.js"></script>
<script src="../../fiesc/ui/multiselector.js"></script>
<script>
goog.require('goog.ui.Button');
goog.require('goog.ui.ButtonRenderer');
goog.require('goog.ui.ButtonSide');
goog.require('goog.ui.CustomButton');
goog.require('goog.ui.Css3ButtonRenderer');
</script>
<style>
body {
	font: 10pt/1.2em Arial, sans-serif; 
}

.ms {
	font: 10pt/1.2em Arial, sans-serif;
	width: 400px;
	padding: 5px 20px;
}

.label-input-label {
	border: 1px solid #000;
	background: none;
	padding: 2px 5px;
}

.ms-item {
	padding: 10px 5px;
}

.ms-odd {
	background-color: #f5f5f5;
}

.ms-srch {
	margin: 10px 0;
}

.ms-flt {
	margin: 10px 0;
	text-align: right;
}

.goog-flat-menu-button {
	margin: 0 5px;
}

.goog-tooltip {
	background: infobackground;
	color: infotext;
	border: 1px solid infotext;
	padding: 1px;
	font: menu;
}
.tooltip2 {
	background: #C0C0FF;
	color: infotext;
	border: 1px solid infotext;
	padding: 1px;
	font: menu;
	width: 120px;
}

.ms-list {
	overflow-y: scroll;
	height: 285px;
}

body {
	font: 10pt/1.2em Arial, sans-serif; 
}
#buttons {
	margin-top: 50px;
}
.fiesc-li {
	padding: 10px 5px;
}

.fiesc-li-odd {
	background-color: #f5f5f5;
}

</style>
</head>
<body>
<div id="manager"></div>
<div id="button1"></div>
<div id="button2"></div>
<script>
var ms = new fiesc.ui.Multiselector();
ms.render(ms.getDomHelper().getElement('manager'));
ms.getList().setSelectable(true);

console.log(goog.events.getTotalListenerCount());

var bt1 = new goog.ui.CustomButton('Receber lista',goog.ui.Css3ButtonRenderer.getInstance());
bt1.render(goog.dom.getElement('button1'));
goog.events.listen(bt1, goog.ui.Component.EventType.ACTION, 
		function(e){
			console.log(ms.getList().getSelectedItems());
		}, false, ms);

var bt2 = new goog.ui.CustomButton('Dispose',goog.ui.Css3ButtonRenderer.getInstance());
bt2.render(goog.dom.getElement('button2'));
goog.events.listen(bt2, goog.ui.Component.EventType.ACTION, 
		function(e){
			console.log(goog.events.getTotalListenerCount());
			ms.dispose();
			console.log(goog.events.getTotalListenerCount());
		}, false, ms);

console.log(goog.events.getTotalListenerCount());

</script>
</body>
</html>